$m(function (args) {
    var $this = $(this.element).closest("body");
    /**
     * 表格的父级标签元素
     * @type {*|jQuery}
     */
    var $tableGridParent = $this.find(".docker_image_datagrid_div");
    /**
     * 表格标签元素
     */
    var $tableGrid;
    /**
     * 保存当前查询到的所有数据
     * @type {{}}
     */
    var allData = {};
    /**
     * 初始化表格
     */
    var initDataGrid = function () {
        if ($tableGrid && $tableGrid.find("").length > 0) {
            $tableGrid.datagrid("destoryTable")
        }
        $tableGrid = $("<table class='tempo_docker_image_grid'></table>").appendTo($tableGridParent);
        $tableGrid.datagrid({
            datatype: "json",
            url: contextPath + '/api/ai/app/docker/page',
            postData: {},
            fit: true,
            autowidth: true,
            mtype: 'POST',
            rownumbers: true,
            shrinkToFit: true,
            viewrecords: true,
            showRefreshBth: true,//是否显示刷新按钮
            pagination: true,
            striped: true,
            multiselect: false,
            separator: false,
            searchBar: true,
            searchBarOptions: {
                auto: true,
                isEnter: true,
                width: "250px",
                placeholder: "请输入镜像名称或服务名称",
                onSearch: function (key) {
                    $tableGrid.datagrid("reloadGrid", {name: key})
                }
            },
            //勾选后的触发事件
            onSelectRow: function () {

            },
            colNames: ['id',
                'flowId',
                '镜像名称',
                '版本号',
                '服务名称',
                '镜像描述',
                '创建者',
                '状态',
                '创建时间',
                '操作'//'操作'
            ],
            colModel: [{
                name: 'id',
                hidden: true
            }, {
                name: 'flowId', //流程ID
                hidden: true
            }, {
                name: 'imageName',//镜像名称
                hidden: false,
                sortable: false,
                align: "center",
                formatter:function (obj) {
                    return TempoMineUtils.encodeHTML(obj);
                }
            }, {
                name: 'imageVersion',//版本号
                width:"80px",
                hidden: false,
                sortable: false,
                align: "center",
                formatter:function (obj) {
                    return "V"+obj;
                }
            }, {
                name: 'serviceName',//服务名称
                hidden: false,
                sortable: false,
                align: "center",
                formatter:function (obj) {
                    return TempoMineUtils.encodeHTML(obj);
                }
            }, {
                name: 'imageDesc',//服务描述
                sortable: false,
                align: "center",
                sortable: false,
                formatter:function (obj) {
                    return TempoMineUtils.encodeHTML(obj);
                }
            }, {
                name: 'imageCreator',//创建者
                width:"60px",
                resizable: false,
                sortable: false,
                align: "center",
                formatter:function (obj) {
                    return TempoMineUtils.encodeHTML(obj);
                }
            },{
                name: 'status',//状态
                width:"60px",
                resizable: false,
                sortable: false,
                align: "center",
                formatter: function (obj) {
                    if(obj ==0){
                        return "成功";
                    }else if(obj == 1){
                        return "失败";
                    }else{
                        return "构建中";
                    }
                }
            }, {
                name: 'imageCreateTime',//创建时间
                hidden: false,
                sortable: false,
                align: "center",
                formatter: function (obj) {
                    if (obj) {
                        return DateUtils.formatDate(new Date(obj), "yyyy-MM-dd HH:mm:ss");
                    }
                    return;
                }
            }, {
                name: 'option',
                index: 'option',
                width:"80px",
                align: "center",
                sortable: false,
                formatter: function (obj, row, grid, state) {
                    var html = "<span ><a class='tempo-image-look'  href='javascript:void(0)' id='" + grid.id + "' style='line-height: 30px;color: #2E90E3;text-decoration: none' title='查看'>" + "查看" + "</a></span>";
                    return html;
                }
            }],
            loadComplete: function (datas) {
                if (datas && datas.rows && datas.rows.length > 0) {
                    $(".tempo-message").hide()
                    for (var i = 0; i < datas.rows.length; i++) {
                        allData[datas.rows[i].id] = datas.rows[i];
                    }
                }else{
                    $tableGridParent.find('.ui-paging-info').hide();
                    $(".tempo-message").show()
                }
                $tableGrid.find(".tempo-image-look").unbind("click").bind("click", function () {
                    var id = $(this).attr("id")
                    openViewDetailDialog(allData[id])
                })
            }

        })

    }
    var openViewDetailDialog = function (job) {
        var paramDialog = $('<div style="width:100%;height:100%;"/></div>').attr("id", 'app-flow-scheduling-execute-detail');
        paramDialog.dialog({
            title: "服务详情",
            width: $this.width(),
            height: $this.height(),
            resizable: false,
            modal: true,
            close: function () {
                paramDialog.dialog('destroy');
            },
            open: function () {
                $m.loadPage(contextPath + "/api/ai/app/docker/docker-image-service-view", $(this), job.id, {"data": job});
                $(".ui-dialog-title").before("<span class='ui-icon tempo-ui-icon tempo-ui-icon-leftarrows-undertint tempo-leftback' style='float: left;margin-top: 12px;'></span>")
                $("#app-flow-scheduling-execute-detail").prev().find("button").css("display", "none")
                $(".ui-draggable-handle").css("cursor", "auto");
                $(".tempo-leftback").css("cursor", "pointer");
                Eventbus.trigger('updateStatusLoop.service', job.FLOWID, null, "sync");
                $(".tempo-leftback").click(function () {
                    paramDialog.dialog('destroy');
                    // 请求服务是否存活
                    // isAlive(job.SERVICEID);
                    $this.find('#mine-opt-job-grid').jqGrid().trigger("reloadGrid");
                    $(".after_select").hide();
                });
            }

        });
    }
    /***
     * 初始化页面
     */
    var init = function () {
        initDataGrid();
    };
    init();
});

